import { useRouter } from "next/router";

export default function ({ data }) {
    const router = useRouter();
    if (router.isFallback) return <div>loading</div>;
    return <>
        <h1>{data.id}</h1>
        <h1>{data.title}</h1>
    </>
}
// 返回用户可以访问到的所有路由
export async function getStaticPaths() {
    return {
        // 返回固定格式的路由参数
        paths: [{ params: { id: "1" } }, { params: { id: "2" } }],
        // 当用户访问的路由参数没有在当前函数中返回时，是否显示404页面
        // false：显示
        // true：不显示
        fallback: true
    }
}
// 返回路由参数所对应的具体数据
export async function getStaticProps({ params }) {
    let id = params.id;
    let data;
    switch (id) {
        case "1":
            data = { id: "1", title: "HELLO" }
            break;
        case "2":
            data = { id: "2", title: "WORD" }
            break;
        case "3":
            data = { id: "3", title: "feating" }
            break;
        default:
            data = {}
            break;
    }
    return {
        props: { data }
    }
}